.lianliankan {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  position: relative;
}
.time {
  width: 320rpx;
  height: 60rpx;
  background: #ffc71c;
  border-radius: 30rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  text {
    font-size: 32rpx;
    color: #fff;
    font-weight: 700;
  }
}
.game {
  width: 100%;
  margin-top: 40rpx;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.game_container {
  width: 20%;
  margin-bottom: 40rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  .game_content {
    width: 280rpx;
    height: 118rpx;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.english {
  .game_content {
    background: url(https://hengxiao-resource.oss-cn-hangzhou.aliyuncs.com/web/resources/images/app/game1.png)
      center/100% no-repeat scroll;
    &.active {
      .game_span {
        color: #ffc71c;
      }
    }
    .game_span {
      font-size: 28rpx;
      color: #0091ea;
      font-weight: 700;
    }
  }
}
.chinese {
  .game_content {
    background: url(https://hengxiao-resource.oss-cn-hangzhou.aliyuncs.com/web/resources/images/app/game2.png)
      center/100% no-repeat scroll;
    .game_span {
      font-size: 28rpx;
      color: #fff;
      font-weight: 700;
    }
    &.active {
      .game_span {
        color: #0091ea;
      }
    }
  }
}
.game_popup {
  position: absolute;
  top: 154rpx;
  left: 50%;
  margin-left: -70rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  .game_popup_content1 {
    width: 147rpx;
    height: 69rpx;
    image {
      width: 100%;
      display: block;
    }
  }
  .game_popup_content2 {
    width: 142rpx;
    height: 70rpx;
    image {
      width: 100%;
      display: block;
    }
  }
}
.info {
  flex: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
}
.info_title {
  width: 506rpx;
  image {
    width: 506rpx;
  }
}
.info_container {
  width: 686rpx;
  padding-top: 50rpx;
  padding-bottom: 20rpx;
  margin: 0 auto;
  border-radius: 40rpx;
  background: #81b7ff;
  box-shadow: 10rpx 10rpx 0px 0px rgba($color: #81b7ff, $alpha: 0.5);
}
.info_content {
  width: 100%;
  margin-bottom: 36rpx;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  text {
    font-size: 28rpx;
    color: #ffffff;
    font-weight: 700;
    &.active {
      font-size: 56rpx;
      text-shadow: 4rpx 4rpx 0 #000000;
      line-height: 72rpx;
    }
  }
}
.info_list {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.info_gold {
  width: 100%;
  margin-bottom: 48rpx;
  display: flex;
  justify-content: center;
  align-items: center;
  .info_gold_img {
    width: auto;
    padding: 0 4rpx;
  }
  .info_gold_text {
    font-size: 42rpx;
    font-weight: bold;
    color: #ffd541;
  }
}
.info_button {
  width: 308rpx;
  margin: 0 auto;
  image {
    width: 100%;
  }
}
.zoomIn {
  animation: zoomIn 0.4s ease 2 both;
}
@keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(4, 4, 4);
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: scale3d(1, 1, 1);
  }
}
